<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>交融动画效果</title>
    <link rel="stylesheet" href="./index.css">
</head>

<body>
    <div class="footer">
        <div class="bubbles">
            <!-- <div class="bubble"></div> -->
        </div>
    </div>
    <svg style="display:none">
        <defs>
            <filter id="blob">
                <feGaussianBlur in="SourGraphic" stdDeviation="10" result="blur"></feGaussianBlur>
                <feColorMatrix in="blur" mode="matrix" values="
                        1 0 0 0 0
                        0 1 0 0 0
                        0 0 1 0 0 
                        0 0 0 20 -10"></feColorMatrix>
            </filter>
        </defs>
    </svg>
    <script src="./index.js"></script>
</body>

</html>